<script setup lang="ts">
import type { ProjectHeaderProps } from '../types/ProjectHeadersProp';

// 定义 props
defineProps<{ header: ProjectHeaderProps, }>();
</script>

<template>
  <div style="background-color: white; border-radius: 1rem; display: flex; flex-direction: column;">
    <h2 style="font-weight: bold; text-align: center; margin: 0.5rem;">
      {{ header.name }}
    </h2>

    <div style="margin: 0.5rem;">
      <a-tag
        v-for="(tag, index) in header.tags"
        :key="index"
        style="border-style: solid;
        border-width: 0.1rem;
        border-radius: 0.2rem;
        margin-bottom: 0.2rem;
        border-color: grey;"
      >
        {{ tag }}
      </a-tag>
    </div>

    <div style="margin: 0.5rem;">
      <div v-if="header.advertise">
        <p style="font-size: 1rem; margin: 0rem;">
          宣传语: {{ header.advertise }}
        </p>
      </div>

      <div v-if="header.company && header.projectStyle === '2'">
        <p style="font-size: 1rem; margin: 0rem;">
          公司: {{ header.company }}
        </p>
      </div>

      <div v-if="header.introductors && header.projectStyle === '3'">
        <p style="font-size: 1rem; margin: 0rem;">
          引荐人: {{ header.introductors }}
        </p>
      </div>

      <div v-if="header.exhibitionCode && header.projectStyle === '4'">
        <p style="font-size: 1rem; margin: 0rem;">
          参展编号: {{ header.exhibitionCode }}
        </p>
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
</style>
